<!--
 * @Author: Bobby
 * @Date: 2021-12-30 10:01:42
 * @LastEditTime: 2022-02-15 17:58:43
 * @LastEditors: Bobby
 * @Description:
 * @FilePath: \wms-v2\src\ve\elements\layout\uiFlexbox\uiFlexbox.vue
 * CIMC-V2
-->
<template>
  <div
    :ref="info._id"
    v-ui-ref="vSetRef"
    class="ui-flexbox"
    :class="[
      'p-' + info.extension.padding.value,
      info.extension.shadow.value,
      info.extension.border.value,
      info.extension.rounded.value,
      info.extension.bg.value,
    ]"
  >
    <el-row :gutter="10">
      <el-col v-for="item in list" :key="item" :span="4">
        <p style="padding: 5px 0; font-size: 12px">{{ item }}</p>
      </el-col>
    </el-row>
    <div v-for="item in selfFormData.detail" :key="item.PACK_LEVEL">
      <el-row :gutter="20">
        <el-col :span="4">
          <el-input v-model.trim="item.PACK_LEVEL" disabled size="mini" />
        </el-col>
        <el-col :span="4">
          <el-input v-model.trim="item.QTY" :disabled="item.PACK_LEVEL == 'EA'" size="mini" />
        </el-col>
        <el-col :span="4">
          <el-input v-model.trim="item.DESCRC" size="mini" />
        </el-col>
        <el-col :span="4">
          <el-checkbox v-model="item.SO_SPILT" false-label="N" true-label="Y" />
        </el-col>
        <!-- <el-col :span="3">
          <el-checkbox
            v-model="item.RP_SPILT"
            :disabled="item.PACK_LEVEL == 'EA' || item.PACK_LEVEL == 'IP' || item.PACK_LEVEL == 'OT'"
            false-label="N"
            true-label="Y"
          />
        </el-col> -->
        <el-col :span="4">
          <el-checkbox v-model="item.RCV_SPILT" false-label="N" true-label="Y" />
        </el-col>
        <el-col :span="4">
          <el-checkbox v-model="item.CAT_FLAG" false-label="N" true-label="Y" />
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
  import { translateTitle } from '@/utils/i18n'
  import { defineComponent } from 'vue'
  import request from '@/utils/request'
  // import isEmpty from 'lodash/isEmpty'

  import { UiMixin, RefsInjectMixin } from '@ve/mixin'
  import cloneDeep from 'lodash/cloneDeep'
  import { GFCD } from '@/utils/utils'
  // import uiForm from '../uiForm/uiForm.vue'
  export default defineComponent({
    name: 'UiPackDetails',
    components: {
      // 使用异步组件
      // Widget: defineAsyncComponent(() => import('@ve/components/widget.vue')),
      // uiForm,
    },
    mixins: [UiMixin, RefsInjectMixin],
    data() {
      return {
        list: [
          translateTitle('Ve.utils.包装层级'),
          translateTitle('Ve.utils.数量转换'),
          translateTitle('Ve.utils.层级描述'),
          translateTitle('Ve.utils.出库标签'),
          // translateTitle('Ve.utils.补货拆分'),
          translateTitle('Ve.utils.入库标签'),
          translateTitle('Ve.utils.强制装箱'),
        ],
      }
    },
    computed: {
      selfFormData() {
        this.info.data.formData.detail.forEach((row) => {
          if (!row.CAT_FLAG) {
            row.CAT_FLAG = 'Y'
          }
        })
        return this.info.data.formData
      },
      getInfo() {
        return this.info
      },
      relevanceData: {
        get() {
          return this.getInfo.extension.getFrom &&
            this.getInfo.extension.getFrom.value[0] &&
            this.vuiComponents[this.getInfo.extension.getFrom.value[0]]
            ? this.vuiComponents[this.getInfo.extension.getFrom.value[0]].self.getInfo.data.formData
            : {}
        },
        set(value) {
          this.vuiComponents[this.getInfo.extension.getFrom.value[0]].self.getInfo.data.formData.PACK_ID = value
        },
      },
    },
    watch: {
      relevanceData: {
        deep: true,
        handler(newVal) {
          console.log('newVal-----------', newVal)
          this.info.data.formData.detail &&
            this.info.data.formData.detail.forEach((row) => {
              row.ORG_ID = newVal.ORG_ID
              row.OWNER_ID = newVal.OWNER_ID
              row.PACK_ID = newVal.PACK_ID
            })
          this.info.data.formData.header = cloneDeep(newVal)
          if (this.hasPreview) {
            if (!newVal.DESCRC && !newVal.PACK_ID && !newVal.PACK_ID && newVal.ACTIVE_FLAG == 'N' && !newVal.FLAG) {
              this.info.data.formData.detail = [
                { PACK_LEVEL: 'EA', QTY: 1, DESCRC: 'EA', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
                { PACK_LEVEL: 'IP', QTY: 0, DESCRC: 'IP', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
                { PACK_LEVEL: 'CS', QTY: 0, DESCRC: 'CS', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
                { PACK_LEVEL: 'PL', QTY: 0, DESCRC: 'PL', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
                { PACK_LEVEL: 'OT', QTY: 0, DESCRC: 'OT', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
              ]
            }
          }
        },
      },
    },
    methods: {
      // 统一请求
      async packRequest(cb) {
        this.loading = true
        let res = await request({
          url: GFCD('dams', 'domain') + this.$store.getters['user/appCodeUrl'],
          method: 'post',
          data: {
            data: JSON.stringify({
              ORG_ID: this.relevanceData.ORG_ID,
              OWNER_ID: this.relevanceData.OWNER_ID,
              PACK_ID: this.relevanceData.PACK_ID,
              '#LIMIT#': 1,
              '#PAGE_SIZE#': 50,
            }),
            method: 'wms.package.details.query',
          },
        })
        this.loading = false
        if (res.data['wms.package.details.query'].data.length > 0) {
          this.info.data.formData.detail = res.data['wms.package.details.query'].data
        }
        if (this.relevanceData.FLAG == 'aaa' && res.data['wms.package.details.query'].data.length == 0) {
          this.info.data.formData.detail = [
            { PACK_LEVEL: 'EA', QTY: 1, DESCRC: 'EA', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
            { PACK_LEVEL: 'IP', QTY: 0, DESCRC: 'IP', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
            { PACK_LEVEL: 'CS', QTY: 0, DESCRC: 'CS', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
            { PACK_LEVEL: 'PL', QTY: 0, DESCRC: 'PL', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
            { PACK_LEVEL: 'OT', QTY: 0, DESCRC: 'OT', SO_SPILT: 'N', RP_SPILT: 'N', RCV_SPILT: 'N', CAT_FLAG: 'Y' },
          ]
          this.info.data.formData.detail &&
            this.info.data.formData.detail.forEach((row) => {
              row.ORG_ID = this.relevanceData.ORG_ID
              row.OWNER_ID = this.relevanceData.OWNER_ID
              row.PACK_ID = this.relevanceData.PACK_ID
            })
        }
        this.info.data._formData = cloneDeep(this.info.data.formData)
        // 回调
        cb && cb(res)
      },
    },
  })
</script>
<style lang="scss" scoped>
  .el-input-number {
    width: 100%;
  }
  :deep() .el-input-number--mini .el-input-number__decrease,
  :deep() .el-input-number--mini .el-input-number__increase {
    height: 24px;
  }

  :deep() [type='number'] {
    border: 1px solid #dcdfe6;
  }
</style>
